<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <link th:href="@{/common/css/bootstrap.min.css}" rel="stylesheet"/>
    <link th:href="@{/common/css/font-awesome.css}" rel="stylesheet"/>
    <link th:href="@{/common/css/animate.min.css}" rel="stylesheet"/>
    <link th:href="@{/common/css/style.min.css}" rel="stylesheet"/>
    <!-- CSS -->
    <link th:href="@{/vendor/datatables/dataTables.bootstrap.css}" rel="stylesheet">
    <link th:href="@{/css/content.css}" rel="stylesheet">

</head>
<body class="gray-bg">
<div class="wrapper wrapper-content animated fadeInRight">
    <div class="ibox float-e-margins">
        <div class="ibox-title">
            <h5>购买订单管理</h5>

            <div class="ibox-tools">

                <!-- <a class="dropdown-toggle" data-toggle="dropdown" href="#" id="btn-add-dtu">
                     <i class="fa fa-plus"></i>新增备件
                 </a>-->
                <a class="dropdown-toggle" data-toggle="dropdown" href="#">
                    <i class="fa fa-backward"></i><a id="btn-project-operations"
                                                    href="JavaScript:history.go(-1)">返回列表</a>
                </a>
            </div>
        </div>
        <div class="ibox-content" id="container">

            <form class="form-horizontal" id="project-tech-form">
                <fieldset>
                    <div class="form-group">
                        <label class="col-sm-2 control-label">订单号：</label>

                        <div class="col-sm-4">
                            <input type="text" placeholder="订单号" class="form-control" th:value="${orderDetail.orderNo}" disabled/>
                        </div>
                        <label class="col-sm-2 control-label">用户名：</label>

                        <div class="col-sm-4">
                            <input type="text" placeholder="用户名" class="form-control" th:value="${orderDetail.userName}" disabled/>
                        </div>

                    </div>
                    <div class="form-group">
                        <label class="col-sm-2 control-label">订单金额：</label>

                        <div class="col-sm-4">
                            <input type="text" placeholder="订单金额"  th:value="${orderDetail.amount}" class="form-control"/>
                        </div>
                        <label class="col-sm-2 control-label">马币抵扣金额：</label>

                        <div class="col-sm-4">
                            <input type="text" placeholder="马币抵扣金额" th:value="${orderDetail.mbAmount}" class="form-control" disabled/>
                        </div>

                    </div>
                    <div class="form-group">
                        <label class="col-sm-2 control-label">维修单状态：</label>
                        <div class="col-sm-4">
                            <input type="text" placeholder="维修单状态"  th:value="${orderDetail.statusDesc}" class="form-control" disabled/>
                        </div>
                    </div>

                    <h3>收货地址信息</h3>
                    <li class="divider"></li>
                    <div class="form-group">
                        <label class="col-sm-2 control-label">企业名称：</label>

                        <div class="col-sm-4">
                            <input type="text" value="企业名称"  class="form-control" th:value="${orderDetail.defaultAddress.companyName}" disabled />
                        </div>
                        <label class="col-sm-2 control-label">联系人：</label>

                        <div class="col-sm-4">
                            <input type="text"   class="form-control" th:value="${orderDetail.defaultAddress.contact}" disabled />
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-2 control-label">联系电话：</label>

                        <div class="col-sm-4">
                            <input type="text"  class="form-control" th:value="${orderDetail.defaultAddress.contactTel}" disabled />
                        </div>
                        <label class="col-sm-2 control-label">联系地址：</label>

                        <div class="col-sm-4">
                            <input type="text" value="联系地址" class="form-control" th:value="${orderDetail.defaultAddress.preAddress+orderDetail.defaultAddress.address}" disabled />
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-2 control-label">特殊要求：</label>
                        <div class="col-sm-4">
                            <textarea class="form-control" name="memo" rows="5" th:width="400px" disabled  th:text="${orderDetail.memo}"></textarea>
                        </div>
                    </div>
                </fieldset>
            </form>

            <div class="nav-tabs-horizontal nav-tabs-inverse" data-approve="nav-tabs">
                <ul class="nav nav-tabs nav-tabs-solid" role="tablist">
                    <li class="" role="presentation">
                        <a data-toggle="tab" href="#exampleIconifiedTabsOne" aria-controls="exampleIconifiedTabsOne"
                           role="tab" aria-expanded="false">
                            <i class="icon wb-user" aria-hidden="true"></i> 商品列表
                        </a>
                    </li>
                    <li role="presentation" class="active">
                        <a data-toggle="tab" href="#exampleIconifiedTabsTwo" aria-controls="exampleIconifiedTabsTwo"
                           role="tab" aria-expanded="true">
                            <i class="icon wb-plugin" aria-hidden="true"></i> 发货清单
                        </a>
                    </li>
                    <li class="dropdown hidden" role="presentation" style="opacity: 1;"><a class="dropdown-toggle"
                                                                                           data-toggle="dropdown"
                                                                                           href="#"
                                                                                           aria-expanded="false"><span
                            class="caret"></span> 更多</a>
                        <ul class="dropdown-menu" role="menu"></ul>
                    </li>
                </ul>
                <div class="tab-content padding-top-15">
                    <div class="tab-pane" id="exampleIconifiedTabsOne" role="tabpanel" style="margin-top: 20px;">
                        <div id="DataTables_Table_0_wrapper" class="dataTables_wrapper form-inline" role="grid">
                            <table class="table table-striped table-bordered table-hover dataTables-example dataTable"
                                   id="DataTables_goodlist" aria-describedby="DataTables_Table_0_info">
                                <thead>
                                <tr role="row">
                                    <th class="sorting_desc" tabindex="0" aria-controls="DataTables_Table_0" rowspan="1"
                                        colspan="1" aria-label="企业名称：激活排序列升序" style="width: 200px;">
                                        商品标题
                                    </th>
                                    <th class="sorting" tabindex="0" aria-controls="DataTables_Table_0" rowspan="1"
                                        colspan="1" aria-label="企业电话：激活排序列升序" style="width: 100px;">单价
                                    </th>
                                    <th class="sorting" tabindex="0" aria-controls="DataTables_Table_0" rowspan="1"
                                        colspan="1" aria-label="企业电话：激活排序列升序" style="width: 100px;">总数量
                                    </th>
                                    <th class="sorting" tabindex="0" aria-controls="DataTables_Table_0" rowspan="1"
                                        colspan="1" aria-label="企业电话：激活排序列升序" style="width: 150px;">已发货
                                    </th>
                                    <th class="sorting" tabindex="0" aria-controls="DataTables_Table_0" rowspan="1"
                                        colspan="1" aria-label="企业电话：激活排序列升序" style="width: 150px;">未发货
                                    </th>
                                </tr>
                                </thead>
                                <tbody>
                                <tr class="gradeA odd" th:each="goods,goodsStat:${orderDetail.orderGoodsDtoList}">
                                    <td class="sorting_1" th:text="${goods.goodsTitle}"></td>
                                    <td class="" th:text="${goods.price}"></td>
                                    <td class="center " th:text="${goods.num}"> </td>
                                    <td class="center " th:text="${goods.deliveryedNum}"> </td>
                                    <td class="center " th:text="${goods.unDeliveryedNum}"> </td>
                                </tr>
                                </tbody>
                            </table>
                        </div>
                    </div>
                    <div class="tab-pane active" id="exampleIconifiedTabsTwo" role="tabpanel" style="margin-top: 20px;">

                        <div class="ibox collapsed float-e-margins border-bottom" th:each="express,expressStat:${orderDetail.expressDtoList}">
                            <div class="ibox-title">
                                <h5 th:text="${express.name +'：'+ express.expressName +' - '+  express.trackingNo}"> </h5>
                                <div class="ibox-tools">
                                    <a class="collapse-link">
                                        <i class="fa fa-chevron-down"></i>
                                    </a>
                                    <a class="dropdown-toggle express-detail-r" data-toggle="dropdown" href="#" th:data="${express.id}">
                                        <i class="fa fa-wrench"></i>包裹明细
                                    </a>
                                    <!--   <a class="dropdown-toggle" data-toggle="dropdown" href="#">
                                           <i class="fa fa-wrench"></i>
                                       </a>
                                       <a class="close-link">
                                           <i class="fa fa-times"></i>
                                       </a>-->
                                </div>
                            </div>
                            <div class="ibox-content" style="display: block;">
                                <div id="DataTables_Table_2_wrapper" class="dataTables_wrapper form-inline" role="grid">
                                    <table class="table table-striped table-bordered table-hover dataTables-example dataTable"
                                            aria-describedby="DataTables_Table_0_info">
                                        <thead>
                                        <tr role="row">
                                            <th class="sorting_desc" tabindex="0" aria-controls="DataTables_Table_0"
                                                rowspan="1"
                                                colspan="1" aria-label="企业名称：激活排序列升序" style="width: 200px;">
                                                商品图片
                                            </th>
                                            <th class="sorting" tabindex="0" aria-controls="DataTables_Table_0"
                                                rowspan="1"
                                                colspan="1" aria-label="企业法人：激活排序列升序" style="width: 100px;">商品名称
                                            </th>
                                            <th class="sorting" tabindex="0" aria-controls="DataTables_Table_0"
                                                rowspan="1"
                                                colspan="1" aria-label="企业电话：激活排序列升序" style="width: 100px;">商品标题
                                            </th>
                                            <th class="sorting" tabindex="0" aria-controls="DataTables_Table_0"
                                                rowspan="1"
                                                colspan="1" aria-label="企业电话：激活排序列升序" style="width: 100px;">单价
                                            </th>
                                            <th class="sorting" tabindex="0" aria-controls="DataTables_Table_0"
                                                rowspan="1"
                                                colspan="1" aria-label="企业电话：激活排序列升序" style="width: 150px;">发货数量
                                            </th>
                                        </tr>
                                        </thead>
                                        <tbody>
                                        <tr class="gradeA odd" th:each="goods,goodsStat:${express.goodsListDtoList}">
                                            <td class="sorting_1"><a
                                                    class="btn-preview" th:data="${goods.imageUrl}">查看大图</a></td>
                                            <td class="" th:text="${goods.goodsName}"></td>
                                            <td class="center " th:text="${goods.goodsTitle}"></td>
                                            <td class="center " th:text="${goods.price}"></td>
                                            <td class="center " th:text="${goods.num}"></td>
                                            <!--  <td class="center ">
                                                  <a class="btn btn-primary btn-detail" data-id="">明细</a>
                                              </td>-->
                                        </tr>
                                        </tbody>
                                    </table>
                                </div>
                            </div>
                        </div>

                    </div>
                </div>
            </div>

        </div>
    </div>
</div>

<div th:replace="order/expressList::express">express</div>
<!-- JS -->
<script type="text/javascript" th:src="@{/common/js/jquery-3.1.1.min.js}"></script>
<script type="text/javascript" th:src="@{/common/js/bootstrap.min.js}"></script>
<script type="text/javascript" th:src="@{/vendor/layer/layer.js}"></script>
<script type="text/javascript" th:src="@{/vendor/datatables/jquery.dataTables.min.js}"></script>
<script type="text/javascript" th:src="@{/vendor/datatables/dataTables.bootstrap.min.js}"></script>
<script type="text/javascript" th:src="@{/common/js/content.min.js}"></script>
<script type="text/javascript" th:src="@{/js/alert.js}"></script>
<script type="text/javascript" th:src="@{/js/Utils.js}"></script>
<script type="text/javascript" th:src="@{/js/order.js}"></script>
</body>
</html>
